<!DOCTYPE html>
<html style="height: 100%">
<head>
    <meta charset="utf-8" />
    <title>优惠券</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=0" />
    <meta name="format-detection" content="telephone=no,email=no" />
    <meta name="mobileOptimized" content="width" />
    <meta name="handheldFriendly" content="true" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="stylesheet" href="/static/css/main.css" />
    <script src="/static/script/zepto.min.js"></script>
</head>
<body style="height: 100%" id="J-body-list">

<div class="m-coup-bar f-cb" id="J_sltBar">
	<span class="z-on" style="border-right: 0;width: 100%">未使用</span>
</div>

<?php if (empty($coupons)){?>
    <div class="m-coup J_sltCnt">
        <h6>您还没有优惠券</h6>
    </div>
<?php } else {?>
    <div class="m-coup J_sltCnt">
        <?php foreach($coupons as $item) { ?>
            <?php  if ($item['type'] == 2 || $item['type'] == 3) {?>
                <?php if ($item['coupons_status'] == 3) {?>
                    <div class="f-cb u-spe2">
                        <img src="/static/img/bg02.png" />
                        <span><?=$item['groupInfo']['name']?></span>
                        <h4><b attr-coupons-id="<?=$item['coupons_id']?>"><?=$item['groupInfo']['voucher']['value']?></b>元<br /><small>(消费满<?=$item['groupInfo']['voucher']['must_voucher_price'] ?>可用)</small><br /><em>有效期至<?=date('Y-m-d',$item['groupInfo']['end_time'])?></em></h4>
                        <h5><b>可使用</b><br /><small>(剩余 <?php $time = $item['groupInfo']['end_time'] - time(); echo intval($time/86400); ?>天)</small></h5>
                    </div>
                <?php }?>
                <?php if ($item['coupons_status'] == 4) {?>
                    <div class="f-cb u-spe2">
                        <img src="/static/img/bg02.png" />
                        <span><?=$item['groupInfo']['name']?></span>
                        <h4><b attr-coupons-id="<?=$item['coupons_id']?>"><?=$item['groupInfo']['voucher']['value']?></b>元<br /><small>(消费满<?=$item['groupInfo']['voucher']['must_voucher_price'] ?>可用)</small><br /><em>有效期至<?=date('Y-m-d',$item['groupInfo']['end_time'])?></em></h4>
                        <h5><b>已使用</b></h5>
                    </div>
                <?php }?>
                <?php if ($item['coupons_status'] == 5) {?>
                    <div class="f-cb u-spe2">
                        <img src="/static/img/bg02.png" />
                        <span><?=$item['groupInfo']['name']?></span>
                        <h4><b attr-coupons-id="<?=$item['coupons_id']?>"><?=$item['groupInfo']['voucher']['value']?></b>元<br /><small>(消费满<?=$item['groupInfo']['voucher']['must_voucher_price'] ?>可用)</small><br /><em>有效期至<?=date('Y-m-d',$item['groupInfo']['end_time'])?></em></h4>
                        <h5><b>已过期</b></h5>
                    </div>
                <?php }?>
            <?php }?>

            <?php  if ($item['type'] == 0 || $item['type'] == 1) {?>
                <?php if ($item['coupons_status'] == 3) {?>

                    <div class="f-cb u-spe1">
                        <img src="/static/img/bg01.png" />
                        <span><?=$item['groupInfo']['name']?></span>
                        <h4><b attr-coupons-id="<?=$item['coupons_id']?>"><?=$item['groupInfo']['discount']['value']?></b>折<br /><small>(消费满<?=$item['groupInfo']['discount']['must_discount_price'] ?>可用)</small><br /><em>有效期至<?=date('Y-m-d',$item['groupInfo']['end_time'])?></em></h4>
                        <h5><b>可使用</b><br /><small>(剩余 <?php $time = $item['groupInfo']['end_time'] - time(); echo intval($time/86400); ?>天)</small></h5>
                    </div>
                <?php }?>
                <?php if ($item['coupons_status'] == 4) {?>
                    <div class="f-cb u-spe1">
                        <img src="/static/img/bg01.png" />
                        <span><?=$item['groupInfo']['name']?></span>
                        <h4><b attr-coupons-id="<?=$item['coupons_id']?>"><?=$item['groupInfo']['discount']['value']?></b>折<br /><small>(消费满<?=$item['groupInfo']['discount']['must_discount_price'] ?>可用)</small><br /><em>有效期至<?=date('Y-m-d',$item['groupInfo']['end_time'])?></em></h4>
                        <h5><b>已使用</b></h5>
                    </div>
                <?php }?>
                <?php if ($item['coupons_status'] == 5) {?>
                    <div class="f-cb u-spe1">
                        <img src="/static/img/bg01.png" />
                        <span><?=$item['groupInfo']['name']?></span>
                        <h4><b attr-coupons-id="<?=$item['coupons_id']?>"><?=$item['groupInfo']['discount']['value']?></b>折<br /><small>(消费满<?=$item['groupInfo']['discount']['must_discount_price'] ?>可用)</small><br /><em>有效期至<?=date('Y-m-d',$item['groupInfo']['end_time'])?></em></h4>
                        <h5><b>已过期</b></h5>
                    </div>
                <?php }?>
            <?php }?>

            <?php  if ($item['type'] == 4 || $item['type'] == 5) {?>
                <?php if ($item['coupons_status'] == 3) {?>
                    <div class="f-cb u-spe3">
                        <img src="/static/img/bg03.png" />
                        <span>兑换券</span>
                        <h4><b attr-coupons-id="<?=$item['coupons_id']?>">100</b>元<br /><small>(消费满300可用)</small><br /><em>有效期至2016年3月20日</em></h4>
                        <h5><b>已过期</b></h5>
                    </div>
                <?php }?>
            <?php }?>

        <?php } ?>
    </div>
<?php }?>

<script>
$(function(){

	// Tab切换
	var sltBar = $('#J_sltBar').children('span'), 
		sltCnt = $('.J_sltCnt'),
		zon = 'z-on';
	sltBar.on('touchend', function(evt){

		var _that = $(this);

		if(_that.hasClass(zon)) return !1;

		var _i = _that.index();

		sltBar.removeClass(zon).eq(_i).addClass(zon);

		var _html = '';

		// 动态加载数据
        $.ajax({ url: 'ajax.coupon.php?funcName=?', dataType:'jsonp', data:{'type':_i}, timeout:5000,

            success: function(_info){

            	console.log(_info);

            	_html = createList(_info);
            	
            	sltCnt.hide().eq(_i).html(_html).show();
            }
        });

		evt.preventDefault();
        return false;
	});

    sltCnt.on('touchend','.f-cb',function(evt){
        var voucher = $(this).find('.f-cb h4 b').text();
        var conpons_id = $(this).find('.f-cb h4 b').attr('attr-coupons-id');
        $("#J_coupon a",window.parent.document).text('- ￥'+voucher);
        $("#J_couponInfo",window.parent.document).text('- ￥'+voucher);
        $("#J-get-coupons",window.parent.document).val(voucher);
        $("#J-get-coupons",window.parent.document).attr('attr_id',conpons_id);
        $.post('/web/order/getcoupons',{voucher:voucher,conpons_id:conpons_id},function(data){
            $("#J_total_info",window.parent.document).text(data);

        },'json')
        parent.document.getElementById('J_actCoupon').className = 'm-transX';
        evt.preventDefault();
        return false;
    })

    $("#J-body-list").on('touchend',function(evt){
        parent.document.getElementById('J_actCoupon').className = 'm-transX';
        evt.preventDefault();
        return false;
    })



});

// 动态创建列表
function createList(info){

	var _html = '';

	for(var i in info){

		var rs = info[i];

		var canUsed = '已使用';
		if(rs['leave'] > 0){
			canUsed = '可使用';
		}else if(rs['leave'] == 0){
			canUsed = '已过期';
		}
		var leave = rs['leave'] > 0 ? '<small>(剩余 '+ rs['leave'] +' 天)</small>' : '';

		_html += '<div class="f-cb u-spe'+ rs['class'] +'">' +
					'<img src="/static/img/bg0'+ rs['class'] +'.png" />' +
					'<span>'+ rs['type'] +'</span>' +
					'<h4><b>'+ rs['money'] +'</b>元<br /><small>('+ rs['desc'] +')</small><br /><em>'+ rs['date'] +'</em></h4>' +
					'<h5><b>'+ canUsed +'</b><br />'+ leave +'</h5>' +
				'</div>';
	}

	if(_html === '') _html = '<h6>您暂无可用的优惠券</h6>';

	return _html;
}
</script>
</body>
</html>
